@use '@material/mwc-top-app-bar/node_modules/@material/top-app-bar/mdc-top-app-bar';
@use '../theme/density.scss';

:host {
  display: block;

  .mdc-top-app-bar__row {
    height: density.density-height(64px, 0, 8px);
  }
}

:host([sticky]) {
  position: sticky;
  top: 0;
  z-index: 2;
}

.mdc-top-app-bar__title {
  padding-left: 0;
}

@media screen and (max-width: 768px) {
  .mdc-top-app-bar__title {
    font-family: var(--mdc-typography-subtitle2-font-family);
    font-size: var(--mdc-typography-subtitle2-font-size);
    font-weight: var(--mdc-typography-subtitle2-font-weight);
    line-height: var(--mdc-typography-subtitle2-line-height);
  }
}

.mdc-top-app-bar {
  position: static;
  background-color: transparent;
  background-color: var(--mdc-theme-surface);
  color: var(--mdc-theme-on-surface);
  border-top-left-radius: var(--cv-border-radius-outer);
  border-top-right-radius: var(--cv-border-radius-outer);
}

.mdc-top-app-bar--fixed-adjust,
.mdc-top-app-bar--dense-fixed-adjust {
  padding-top: 0;
}
